<template>
    <div>
        <!-- 最终结算 -->
        <a-form :model="form" ref="formRef" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }"
            autocomplete="off">
            <a-row :gutter="16">
                <a-col :span="12">
                    <a-form-item label="项目名称" name="proName" :rules="[{ required: true }]">
                        <a-input-search v-model:value="form.proName" :disabled="disabled" style="width: 100%"
                            placeholder="请选择项目" @click="onSearch" @search="onSearch" />
                    </a-form-item>
                </a-col>
                <a-col :span="12">
                    <a-form-item label="项目编号" name="proCode">
                        <a-input v-model:value="form.proCode" disabled style="width: 100%" placeholder="请选择项目" />

                    </a-form-item>
                </a-col>
            </a-row>


            <a-row :gutter="16">
                <a-col :span="12">
                    <a-form-item label="合作单位" name="cooperator" :rules="[{ required: true }]">
                        <a-input v-model:value="form.cooperator" :disabled="disabled" style="width: 100%"
                            placeholder="" />
                    </a-form-item>
                </a-col>
                <a-col :span="12">
                    <a-form-item label="结算金额" name="amount" :rules="[{ required: true }]">
                        <a-input-number :precision="2" :min="0"  v-model:value="form.amount" :disabled="disabled"
                            style="width: 100%" suffix="元" placeholder="" />
                    </a-form-item>
                </a-col>
            </a-row>

            <a-row :gutter="16">
                <a-col :span="12">
                    <a-form-item label="上传附件" name="file">
                        <fileUpload @uploadDone="uploadDone" :type="1" ref="uploadRef1" :uploadNumber="4">
                        </fileUpload>
                    </a-form-item>
                </a-col>
            </a-row>

            <a-row :gutter="16">
                <a-col :span="24">
                    <a-form-item :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }" label="项目情况" name="remark">
                        <a-textarea v-model:value="form.remark" :disabled="disabled" :rows="4" placeholder=""
                            style="width: 100%" />
                    </a-form-item>
                </a-col>
            </a-row>
            <system :value="form"></system>
        </a-form>
       
        <projectSelection ref="proSelect" @onClose="prSelectOk"  />
        <userSelectorPlus ref="userSelectorRef" @OnClose="userSelectorOk"></userSelectorPlus>
    </div>
</template>

<script setup>
 import system from '@/components/Task/system.vue'
import fileUpload from '@/components/JqUpload/index.vue'
import projectSelection from '@/components/pm/projectSelection.vue'
import userSelectorPlus from '@/components/Selector/userSelectorPlusExtend.vue'
const isShow = ref(false)

const form = ref({
});
const uploadDone = (result) => {
    form.value.files = result
}
const userSelectorRef = ref()
const showUserSelect = () => {
    userSelectorRef.value.show("")
}
const userSelectorOk = (data) => {
    form.value.directorName = data.value.directorName
    form.value.director = data.value.directorId
}


const proSelect = ref()
const onSearch = () => {
    proSelect.value.show()
}
const prSelectOk = (selectedRowKeys, selectRecords) => {
    // console.log("项目选择ok ", selectedRowKeys, selectRecords)
    form.value.proId = selectRecords[0].id;
    form.value.proCode = selectRecords[0].code;
    form.value.proName = selectRecords[0].name;
}

const formRef = ref(null)


// const emits = defineEmits(['OnClose'])
// const onClose = (refresh) => {
//     form.value = {};
//     emits('OnClose', refresh)
// };



const props = defineProps({
    value: {
        type: Object,
        default: () => { }
    },
    disabled: {
        type: Boolean,
        default: () => false
    },
})
watch(
    () => props.value,
    (newVal, oldVal) => {
        if (newVal) {
            form.value = { ...newVal }
            if (form.value.name) {
                columns.splice(columns.length - 1, 1)
            }
        }
    },
    { deep: true, immediate: true }
)

const getData = () => {
    return new Promise((resolve, reject) => {
        formRef.value.validate().then(() => {
            form.value.flowCode = "FLW_SETTLEMENT"
            resolve(form.value)
        }).catch((err) => {
            reject(err)
        });
    })
}
// 重置
const resetForm = () => {
    form.value = {}
}
defineExpose({
    getData,
    resetForm,

})

</script>